<template>
    <div>
        <el-card class="box-card">
            <div slot="header" class="clearfix">
                <span>周报列表</span>
            </div>
            <!-- 周报表格 -->
            <el-table :data="tableData" border style="width: 100%">
                <!-- 显示起始日期 -->
                <el-table-column fixed prop="startTime" align="center" label="开始日期" width="250" >
                    <template slot-scope="scope">
                        {{ scope.row.startTime }}
                    </template>
                </el-table-column>

                <el-table-column fixed prop="endTime" align="center" label="结束日期" width="250" >
                    <template slot-scope="scope">
                         {{ scope.row.endTime }}
                    </template>
                </el-table-column>
                <!-- 显示周数 -->
                <el-table-column prop="number" align="center" label="周数" width="220" >
                    <template slot-scope="scope">
                         第{{ scope.row.number }}周
                    </template>
                </el-table-column>


                <el-table-column prop="timeId" align="center" label="周报ID" width="220">
                    <template slot-scope="scope">
                         周报编号{{ scope.row.timeId }}
                    </template>
                </el-table-column>
                <el-table-column fixed="right" align="center" label="操作" min-width="120">
                    <template slot-scope="scope">
                        <el-button
                            v-if="scope.row.briefSummary=== null ? true:false"
                            @click="handleAdd(scope.row)"
                            type="text"
                            size="medium">添加</el-button>
                        <el-button
                            v-if="scope.row.briefSummary=== null ? false:true"
                            @click="handleCheck(scope.row)"
                            type="text" size="medium ">查看</el-button>
                        <el-button
                            v-if="scope.row.briefSummary=== null ? false:true"
                            @click="handleEdit(scope.row)"
                            type="text"
                            size="medium ">编辑</el-button>
                    </template>
                </el-table-column>
            </el-table>
<!--            分页组件-->
<!--          <div class="pagination">-->
<!--            <el-pagination-->
<!--              @size-change="handleSizeChange"-->
<!--              @current-change="handleCurrentChange"-->
<!--              :current-page="currentPage"-->
<!--              background-->
<!--              :page-sizes="[5, 10, 20, 30]"-->
<!--              :page-size="5"-->
<!--              layout="total, sizes, prev, pager, next, jumper"-->
<!--              :total="total"-->
<!--            >-->
<!--            </el-pagination>-->
<!--          </div>-->

        </el-card>

        <!-- 报表弹窗 -->
        <addWeekTable :isShowAdd="isShowAdd" @handleClose="closeAdd" :clickInfo="clickInfo" />
        <showWeekTable :isShowCheck="isShowCheck" @handleCloseCheck="closeCheck" :checkInfo="checkInfo"></showWeekTable>
        <editWeekTable :isShowEdit="isShowEdit" @handleCloseEdit="closeEdit" :editInfo="editInfo" :editData="editData"></editWeekTable>
    </div>
</template>

<script>
import { getWeekListById } from "@/api/request";
import addWeekTable from '@/components/ReportComponents/addWeekTable.vue'
import showWeekTable from '@/components/ReportComponents/showWeekTable.vue'
import editWeekTable from '@/components/ReportComponents/editWeekTable.vue'
// import { getWeekTime } from '@/api/weekTime'
import {addWeekTime, getWeekReportByTimeId, getWeekTime, getWeekTimeById} from "@/api/weekTime";
export default {
    components: {
        showWeekTable,
        addWeekTable,
        editWeekTable
    },
    created() {
        //获取用户所有周报信息
        this.getListByuserId()
      this.getWeekReportList()
    },
    methods: {
        // 获取分页数据
      getWeekReportList() {
        this.loading = true
        getWeekListById(this.params).then(res => {
          // console.log("45645",res)
          this.tableData = res.rows
          this.total = res.total
          this.loading = false
        })
      },
      handleSizeChange(value) {
        this.params.pageSize = value;
        this.getWeekReportList()
      },
      handleCurrentChange(value) {
        this.params.pageNum = value;
        this.getWeekReportList()
      },
      //处理关闭弹窗
        closeAdd() {
            this.isShowAdd = false
            //关闭后刷新列表数据重新渲染
            this.getListByuserId()
        },
        //关闭查看弹窗
        closeCheck() {
            this.isShowCheck = false
            //关闭后刷新列表数据重新渲染
            this.getListByuserId()
        },
        //关闭修改弹窗
        closeEdit() {
            this.isShowEdit = false
            //关闭后刷新列表数据重新渲染
            this.getListByuserId()
        },
        //获取用户端周报信息
        getListByuserId() {
            getWeekListById(this.params).then(res => {

                this.tableData = res.rows
            }).catch(err => {
                console.log('获取失败')
            })
        },


        //判断用户需要添加的周报列表
        //处理添加周报
        handleAdd(row) {
            // this.submitReport.id = row.id
            //将弹窗显示值设置为true
            this.isShowAdd = true
            //将点击获取的周报时间段信息传给变量传入子组件
            this.clickInfo = row
        },
        //处理查看周报
        handleCheck(row){
            //将弹窗显示值设置为true
            this.isShowCheck = true
            this.checkInfo = row
            this.checkInfo = JSON.parse(this.checkInfo.briefSummary)

        },

        //处理修改周报
        handleEdit(row){
            this.isShowEdit = true
            this.editInfo = row
            this.editInfo = JSON.parse(this.editInfo.briefSummary)
            this.editData = row
        },
    },

    data() {
        return {
            editData:null,//存放便捷界面需要的数据
            checkInfo:{},//操作查看获取的周报数据(存放查看的周报数据)
            clickInfo: {},//操作点击获取的当前行的信息（存放添加周报需要的数据）
            editInfo: {},//操作点击获取需要修改的信息（存放修改周报需要的数据）
            isShowAdd: false,//控制添加周报组件表单弹窗开关
            isShowCheck:false,//控制查看周报表单开关
            isShowEdit:false,//控制修改周报表单开关
            // activeNames: ['1'],
            tableData: [],

          weekTimeList: [],//分页
          total: 0,
          currentPage: 1,
          params: {
            pageSize: 5,
            pageNum: 1,
            userId:this.$store.state.user.userId
          },
        }
    }
}
</script>

<style scoped>

</style>
